<template>
	<view class="updateAddress">
		<u-form :model="form" class="addAddress-form">
			<u-form-item label="姓名" label-width="auto">
				<u-input v-model="form.name" placeholder="请输入姓名" input-align="center" />
			</u-form-item>
			<u-form-item label="手机号" label-width="auto">
				<u-input v-model="form.phone" placeholder="请输入手机号" input-align="center" />
			</u-form-item>
			<u-form-item label="性别" label-width="auto">
				<u-input v-model="selectText" type="select" :border="border" @click="onselect = true"
					placeholder="请选择性别" input-align="center" />
				<u-action-sheet :list="sexOptions" v-model="onselect" @click="actionSheetCallback"></u-action-sheet>
				<!-- <u-select v-model="onselect" :list="sexOptions" @click="showSelect()"></u-select> -->
			</u-form-item>
			<u-form-item label="收货地址" label-width="auto">
				<u-input v-model="form.detailAddress" placeholder="请输入收货地址" input-align="center" />
			</u-form-item>
			<u-form-item label="是否默认" label-width="auto">
				<u-switch slot="right" v-model="isDefault"></u-switch>
			</u-form-item>
			<view class="addAddress-submit">
				<u-button @click="addressSubmit()" type="primary">修改</u-button>
			</view>
			<view class="addAddress-submit">
				<u-button @click="deleteShow=true" type="warning">删除</u-button>
			</view>
		</u-form>
		<!-- 提示 -->
		<u-top-tips ref="uTips"></u-top-tips>
		<!-- 删除确认 -->
		<u-modal v-model="deleteShow" :content="content" :show-cancel-button=true @confirm="addressDelete()"></u-modal>
	</view>
</template>

<script>
	import {
		updateAddress, deleteAddress
	} from '@/api/system/address/address'
	export default {
		data() {
			return {
				sexOptions: [{
						text: "男"
					},
					{
						text: "女"
					},
					{
						text: "未知"
					}
				],
				border: false,
				onselect: false,
				selectText: '',
				isDefault: false,
				deleteShow: false,
				content: '是否确认删除',
				form: {
					name: '',
					phone: '',
					sex: '',
					detailAddress: '',
					isDefault: ''
				},
			}
		},
		onLoad(options) {
			this.item = JSON.parse(options.item);
			// console.log("接收内容：",this.item);
			this.form = this.item;
			const sex = this.item.sex;
			// 设置性别选择框
			if ( sex === '0'){
				this.selectText = '男'
			} else if( sex === '1'){
				this.selectText = '女'
			} else{
				this.selectText = '保密'
			}
			// 设置是否默认单选框
			if(this.item.isDefault === 1){
				this.isDefault = true
			}else{
				this.isDefault = false
			}
		},
		methods: {
			actionSheetCallback(index) {
				// console.log(index)
				// this.form.sex = this.actionSheetList[index].text;
				this.form.sex = index;
				this.selectText = this.sexOptions[index].text;
			},
			addressSubmit() {
				if (this.isDefault === true) {
					this.form.isDefault = 1
				} else {
					this.form.isDefault = 0
				}

				if (this.form.name === '' || this.form.phone === '' || this.form.sex === '' || this.form.detailAddress ===
					'') {
					this.$refs.uTips.show({
						title: '请将信息填写完整',
						type: 'warning',
						duration: '1000'
					})
					return;
				}
				// console.log(this.form)
				const reg = /^[1][3-9]\d{9}$/; // 以1开头，第二位3-9，后面跟9位数字
				if (!reg.test(this.form.phone)) {
					this.$refs.uTips.show({
						title: '请检查手机号码',
						type: 'warning',
						duration: '1000'
					})
					return;
				}

				updateAddress(this.form).then(res => {
					if (res.code === 200) {
						this.$modal.msgSuccess("修改成功");
						 setTimeout(() => {
							this.$tab.navigateBack();
						}, 1000);
					} else {
						this.$modal.msgError("出错了:" + res.msg);
					}
				})
			},
			addressDelete(){
				console.log("delete")
				deleteAddress(this.form.addressId).then(res => {
					console.log(res)
					if (res.code === 200){
						this.$modal.msgSuccess("删除成功");
						 setTimeout(() => {
							this.$tab.navigateBack();
						}, 1000);
					} else {
						this.$modal.msgError("出错了:" + res.msg);
					}
				})
			}

		}
	}
</script>

<style>
	.addAddress {
		width: 100vw;
		height: 100vh;
	}

	.addAddress-form {
		margin: 15px 3vw;
		border-radius: 10px;
		padding: 0 5vw 15px 5vw;
		width: 94vw;
		background-color: white;
	}

	.addAddress-submit {
		margin-top: 20px;
		margin-left: 13%;
		width: 74%;
	}
</style>